allData = null   // 服务器端返回的所有的数据： {"1": [], "2": [], "3": []}
let currentStepInfos = null // 当前遍历的类型("基本情况"、"功能情况"、"外观情况")的数据
let currentStepIndex = 1    // 当前遍历的类型的数据的 key, 服务器端返回的每个类型的key 也是 1  2  3; dom元素选择的时候也是 1 2 3
let currentInfoDom = $(`#property_step${currentStepIndex} dl`)


let goodDiscounts = new Array()
let assessInfoList = new Array()
let stepTwoFlag = true
// let stepTwoDetailIdIndex = 0

let controlBack = true

let perStepIndex = 0   // 每一步的索引
let goodsAssessId = url

let detailNameCheckbox = new Array()

// let url=window.location .href;
// let temp = url;
// let aa=url.indexOf('=');
// if (aa>-1){
//     url=url.substring(aa+1); //获取到商品的id信息
// }

$(function () {
    $.ajax({
        url: 'http://localhost:8080/evaluate-base-info?goodsId=' + goodsAssessId,
        type: 'get',
        dataType: 'json'
    }).then(res => {  // res 对应的是 result
        $.ajax({
            url: 'http://localhost:8080/evaluate-base-info/price?goodsId=' + url,
            type: 'get',
            dataType: 'json'
        }).then(res => {  // res 对应的是 result
            goodsAllDatas = res.data // 返回的数据是 [{}, {}, {}]
        })
        allData = res.data // 返回的数据是 [{}, {}, {}]
        currentStepInfos = allData[currentStepIndex + '']
        renderStepOneInfo()  // 渲染第一步的数据
        console.log(allData)
        console.log(goodsAllDatas)
    })
    // console.log(getCookie('username'))
})


function renderStepOneInfo() {
    let baseInfoHtml = ``
    if(currentStepInfos) {
        let baseInfo = currentStepInfos[perStepIndex]
        if(baseInfo) {  // 表示有内容才渲染
            baseInfoHtml += `
                        <dd>
                            <input type="hidden" name="property[]" id="property_version" value="0"/>
                            <div class="property_title"><h3 style="font-weight: 800;">${baseInfo.baseInfoName}</h3></div>
                            <ul>
                    `
            let baseInfoDetails = baseInfo.evaluateInfoDetails  // 基本信息下的子项
            let j
            for(j = 0; j < baseInfoDetails.length; j++) {
                let detail = baseInfoDetails[j]  // 每一个子项
                baseInfoHtml += `
                            <li class="" onClick="base_info_property(this, '${baseInfo.baseInfoName}', ${detail.id}, '${detail.detailName}', ${baseInfo.isMultiple}, ${detail.goodDiscount})" name="sx_child_1">
                                    <div class="pro_div"><span class="property_value"><i>${detail.detailName}</i><ins>${detail.desc}</ins></span><span
                                            class="gou"></span></div>
                            </li>`
            }
            if(baseInfo.isMultiple){
                let detail = baseInfoDetails[j-1]
                baseInfoHtml += `
                            <li class="" onClick="base_info_isMultiple(this, '${baseInfo.baseInfoName}', ${detail.id}, '${detail.detailName}')" name="sx_child_1">
                                    <div class="pro_div"><span class="property_value"><i>确定</i><ins></ins></span><span
                                            class="gou"></span></div>
                            </li>`
            }
            baseInfoHtml += `<div class="clear"></div>
                        </ul>
                    </dd>`
            currentInfoDom.prepend(baseInfoHtml)
        }else {
            currentStepInfos = allData[++currentStepIndex + '']
            currentInfoDom = $(`#property_step${currentStepIndex} dl`)
            perStepIndex = 0
            controlBack = true
        }
    }
}

/**
 * 第一个参数是当前点击的 “子项”,  因为页面有个效果，是隐藏当前点击的项目, 在Js中 this 都是dom对象
 */
function base_info_property(currentLiTag, baseInfoName, detailId, detailName, isMultiple, goodDiscount) {
    // $(curentLiTag) -> 将当前点击的 li 标签转换为 jquery对象，因为我们要使用 jquery的方法
    // parents('dd') 表示查找到离当前 li 最近的那个祖先元素
    // remove() 移除掉找到的那个 dd 标签

    if(!isMultiple){
        stepTwoDetailId.push(detailId)
        stepTwoDetailName.push(encodeURIComponent(detailName))
        goodDiscounts.push(goodDiscount)
        let assessInfo = {detailId:detailId, detailName:detailName};
        assessInfoList.push(assessInfo)
        $(currentLiTag).parents('dd').remove()

        // console.log(detailId)

        // after() 在选中的那个 p 标签后面插入一段 html 脚本
        $(`#property_step${currentStepIndex} > p:last`).after(
            `<p style="font-weight: 800; font-size: 16px; margin-bottom: 10px;">
                        <span>${perStepIndex + 1}. ${baseInfoName}</span>
                        <span>已选: <span style="color: #f24644;">${detailName}</span></span>
                    </p>`
        )

        perStepIndex++   // 为了渲染下一项
        renderStepOneInfo()
    }else {
        // alert(111)
        // $(".pro_div").css("border-color","yellow")
        $(currentLiTag).children('div').css("border-color","orange")
        stepTwoDetailId.push(detailId)
        stepTwoDetailName.push(encodeURIComponent(detailName))
        detailNameCheckbox.push(detailName)
        goodDiscounts.push(goodDiscount)
        let assessInfo = {detailId:detailId, detailName:detailName};
        assessInfoList.push(assessInfo)
    }
}

function base_info_isMultiple(currentLiTag, baseInfoName) {
    // $(curentLiTag) -> 将当前点击的 li 标签转换为 jquery对象，因为我们要使用 jquery的方法
    // parents('dd') 表示查找到离当前 li 最近的那个祖先元素
    // remove() 移除掉找到的那个 dd 标签

    $(currentLiTag).parents('dd').remove()

    // console.log(detailId)

    // after() 在选中的那个 p 标签后面插入一段 html 脚本
    let tempHtml = ``
    tempHtml += `
    <p style="font-weight: 800; font-size: 16px; margin-bottom: 10px;">
        <span>${perStepIndex + 1}. ${baseInfoName}</span>
        <span>已选: 
    `
    for (let detailNameCheckbox1 of detailNameCheckbox) {
        tempHtml += `
            <span style="color: #f24644;">${detailNameCheckbox1}</span> | </span>
        `
    }
    tempHtml +=`</p>`

    $(`#property_step${currentStepIndex} > p:last`).after(
        tempHtml
    )

    perStepIndex++   // 为了渲染下一项
    renderStepOneInfo()
    detailNameCheckbox.splice(0,detailNameCheckbox.length)
}

function stepOne_next(){
    var flag	=	true;
    $("#property_step1 input").each(function(){if($(this).val()==0){flag=false;return false;}});
    if(! flag){
        alert('请选择评估参数');
        return false;
    }
    $("#property_step2").show();
    $("#property_step1").hide();
    if(controlBack)
        renderStepOneInfo()
    $("#speed2").show();
    $("#speed1").hide();
}

function stepTwo_next(){
    let flag = true;
    let nextFlag = true;
    let baseInfo = currentStepInfos[perStepIndex]


    if(stepTwoDetailId.length > 4){
        flag = false
    }
    let arrayTwoLast = new Array()
    for (let allDataKey in allData) {

        if (allDataKey == 2){
            let twoLastMap = allData[2+''][(allData[2+''].length-1) + ''].evaluateInfoDetails
            for (let twoLastMapKey in twoLastMap) {
                arrayTwoLast.push(twoLastMap[twoLastMapKey+''].id)
            }
        }

    }

    for (let arrayTwoLastElement of arrayTwoLast) {
        if (stepTwoDetailId.includes(arrayTwoLastElement)){
            flag = true
        }
    }

    if(baseInfo.isMultiple){
        // alert(111)
        base_info_isMultiple($(this).parents('.property_nav').prev().children().find('li:last'), baseInfo.baseInfoName)
        // console.log($(this).parents('.property_nav').prev().children().find('li:last'))
        nextFlag = false
    }

    if(! flag && nextFlag){
        alert('请选择评估参数');
        return false;
    }
    if (nextFlag){

        $("#property_step3").show();
        $("#property_step2").hide();
        currentStepIndex = 3
        currentStepInfos = allData[currentStepIndex + '']
        currentInfoDom = $(`#property_step${currentStepIndex} dl`)
        perStepIndex = 0
        if(controlBack)
            renderStepOneInfo()

        $("#speed3").show();
        $("#speed2").hide();
    }
}
function step2_back(){
    $("#property_step1").show();
    $("#property_step2").hide();
    controlBack = false

    $("#speed1").show();
    $("#speed2").hide();
}
function step3_back(){
    $("#property_step2").show();
    $("#property_step3").hide();
    controlBack = false
    $("#speed2").show();
    $("#speed3").hide();
}

function showprice(){
    let flag = false
    let arrayTwoLast = new Array()
    for (let allDataKey in allData) {

        if (allDataKey == 3){
            let twoLastMap = allData[3+''][(allData[3+''].length-1) + ''].evaluateInfoDetails
            for (let twoLastMapKey in twoLastMap) {
                arrayTwoLast.push(twoLastMap[twoLastMapKey+''].id)
            }
        }

    }
    // console.log(arrayTwoLast)
    for (let arrayTwoLastElement of arrayTwoLast) {
        if (stepTwoDetailId.includes(arrayTwoLastElement)){
            flag = true
        }
    }
    if(! flag){
        alert('请选择评估参数');
        return false;
    }
    // alert(stepTwoDetailId)
    // alert(goodDiscounts)
    console.log(stepTwoDetailId)
    // basicInfoList = stepTwoDetailId
    setCookie("stepTwoDetailId", JSON.stringify(stepTwoDetailId))
    setCookie("stepTwoDetailName",JSON.stringify(stepTwoDetailName))
    // setCookie("assessInfoList",assessInfoList)
    console.log(assessInfoList)
    for (let goodDiscount of goodDiscounts) {
        goodsPrice -= goodDiscount
    }
    setCookie('goodsId',url)
    setCookie('goodsPrice',goodsPrice)
    setCookie('goodImg',goodsAllDatas.goodImg)
    console.log(goodsPrice)
    window.location.href = 'http://localhost:8080/html/03-price.html'
}

$(document).ready(function () {
    $("#step1_nav .btn_next").bind('click', stepOne_next);
    $("#step2_nav .btn_next").bind('click', stepTwo_next);
    $("#step2_nav .btn_back").bind('click', step2_back);
    $("#step3_nav .btn_back").bind('click', step3_back);

    $("input[name='property[]']").each(function () {
        $(this).val(0);
    })
    $("#property_step1 input[name='desc_id[]']").each(function () {
        $(this).val(0);
    })
    $("#property_step3 input[name='desc_id[]']").each(function () {
        $(this).val(0);
    })
    $("#pj_ids").val(0);
})
